<template>
	<view class="container">
		
		<view class="topview">
			<view class="banner_bg">
				<image src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fc-ssl.duitang.com%2Fuploads%2Fitem%2F202004%2F24%2F20200424225435_elmom.jpg&refer=http%3A%2F%2Fc-ssl.duitang.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1683636665&t=634597280406def0888e4497b883251e" mode=""></image>
			</view>

			<view class="perinfo" @click="login">
				<view class="pho">
					<image src="@/static/tx.jpg" mode=""></image>
				</view>
				<!-- 				<view class="pho">
				      <open-data type="userAvatarUrl"></open-data>
				</view> -->

				<view class="adoptedland">
					<view class="topland">
						<!-- <open-data type="userNickName"></open-data> -->
						{{userInfo.nickname}}
					</view>
					<view class="bottomland">
						id：{{userInfo.id}}
					</view>
				</view>


			</view>
		</view>




		<view class="orderContent-box">

			<view class="orderContent-item" @click="toorderlist">
				<image src="@/static/whirt.png" alt=""></image>
				<text>创作记录</text>
				<view></view>
				<image src="@/static/hintRight.svg" alt=""></image>
			</view>
			<view class="orderContent-item" @click="tohostlist">
				<image src="@/static/us.png" alt=""></image>
				<text>关于我们</text>
				<view></view>
				<image src="@/static/hintRight.svg" alt=""></image>
			</view>
			<view class="orderContent-item" @click="toAuthority">
				<image src="@/static/authorit.png" alt=""></image>
				<text>我的权限</text>
				<view></view>
				<image src="@/static/hintRight.svg" alt=""></image>
			</view>
			<view class="orderContent-item" @click="tosetting">
				<image src="@/static/set-up-dot.png" alt=""></image>
				<text>我的设置</text>
				<view></view>
				<image src="@/static/hintRight.svg" alt=""></image>
			</view>

		</view>
	</view>
</template>

<script>

	export default {
		data() {
			return {
				code: null,
				userInfo: {
					nickname: '游客1024',
					pictureUrl: '@/static/tx.jpg',
					id: '0052'
				},
				info: {},
				changeNum: '1'

			}

		},

		onShow() {
			let name = uni.getStorageSync('name');
			let uid = uni.getStorageSync('uid');
			if(name) {
				this.userInfo.nickname = name
				this.userInfo.id = uid
			}else {
				console.log(name,uid);
			}

			
		},
		onPullDownRefresh() {
			// console.log('触发了下拉刷新')
			setTimeout(() => {
				uni.stopPullDownRefresh()
				const pages = getCurrentPages()
				//声明一个pages使用getCurrentPages方法
				const perpage = pages[pages.length - 1]
				//声明一个当前页面
				perpage.onLoad()
				//执行刷新
			}, 1000)
		},

		//分享
		onShareTimeline(){
			return {
		      	path:"pages/my/my",  //不设置默认当前页面
		        title: "归园土地管理", 
		        imageUrl:"https://xingqiu-tuchuang-1256524210.cos.ap-shangha…23-02-02/ea369ef3-87b5-4756-b2fe-5ec5a46c2445.jpg" //不设置默认截取页面
		    }
		},
		
		onShareAppMessage(res) {
			// return eventHandler接收到的分享参数
			return {
				title: '归园土地管理', // 分享名称
				path: 'pages/my/my', // 这里写你这个页面的路径
				imageUrl: '', //这个是显示的图片，不写就默认当前页面的截图
				success(shareTickets) {
					console.log(shareTickets + '成功');
					uni.showToast({
						title: '提交成功',
						duration: 1500
					})
					// 转发成功
				},
				fail: function(res) {
					console.log(res + '失败');
					// 转发失败
				},
				complete: function(res) {
					// 不管成功失败都会执行
				}
			}
		},

		methods: {

			login() {
				uni.login({
					provider: 'weixin',
					success: (res) => {
						uni.showLoading({
							title: '加载中'
						});
						this.code = res.code;
						console.log(res.code);
						if (res.code) {
							wechatLogin({
								code: res.code,

							}).then(res => {
								console.log(res);
								this.userInfo.nickname = res.data.data.nickname
								this.userInfo.id = res.data.data.id
								this.userInfo.pictureUrl = res.data.data.pictureUrl

								uni.setStorageSync('userInfo', res.data.data);
								uni.setStorageSync('id', res.data.data.id);
								uni.setStorageSync('token', res.data.data.token);
								// const token = uni.getStorageSync('token')
								// console.log();


							})
						}
						uni.hideLoading();
						if (this.changeNum == '2') {
							uni.showModal({
								title: '提示',
								content: '是否更改头像昵称',
								success: function(res) {
									if (res.confirm) {
										uni.navigateTo({
											url: '/pages/inputInfo/inputInfo',
											fail(error) {
												console.log(error)
											}
										})
									} else if (res.cancel) {

									}
								}
							});
						} else {
							this.changeNum = 2
							console.log('num', this.changeNum);
						}
					}
				});
			},

			toPrivate() {
				uni.navigateTo({
					url: '/pages/PrivateMessage/PrivateMessage',
					fail(error) {
						console.log(error)
					}
				})
			},

			toaddress() {
				uni.navigateTo({
					url: '/pages/ManageAddress/ManageAddress',
					fail(error) {
						console.log(error)
					}
				})
			},

			tosetting() {
				uni.navigateTo({
					url: '/pages/setting/setting',
					fail(error) {
						console.log(error)
					}
				})
			},

			toAuthority() {
				uni.navigateTo({
					url: '/pages/Authority/Authority',
					fail(error) {
						console.log(error)
					}
				})
			},
			tohostlist() {
				uni.navigateTo({
					url: '/pages/about/about',
					fail(error) {
						console.log(error)
					}
				})
			},
			toorderlist() {
				uni.navigateTo({
					url: '../createList/createList',
					fail(error) {
						console.log(error)
					}
				})
			},



		}
	}
</script>



<style lang="less" scoped>
	.container {
		width: 100%;
		height: 95vh;
		// background-color: rgb(242, 242, 242);
	}
	
	.header {
	    display: flex;
	    flex-direction: column;
	    justify-content: center;
	    height: 145rpx;
	    margin-left: 40rpx;
	    margin-right: 40rpx;
	    border-bottom: 1rpx solid rgba(0, 0, 0, 0.06);
	    padding-bottom: 15rpx;
	}
	
	.header .header-title {
	    color: rgba(0, 0, 0, 1);
	    font-size: 40rpx;
	    font-weight: 700;
	}
	
	.header .oneWorld {
	    font-size: 30rpx;
	    color: rgba(0, 0, 0, 0.45);
	    margin-top: 7rpx;
	}

	@keyframes identifier {
		from {
			transform: translateY(-1900px);
			// transform: translate(80,100);
		}

		to {
			transform: translateY(0px);

		}
	}

	.topview {
		position: relative;
		width: 100%;
		height: 30%;
		// background-image: linear-gradient(to top, #3daf5d, #67e26f);
		// border-radius:0 0 10px 10px;
		text-align: center;
		padding-top: 15%;
		box-sizing: border-box;

		.perinfo {
			width: 90%;
			height: 110px;
			background-color: #fff;
			border-radius: 10px;
			margin: 0 auto;
			padding: 15px 0;
			box-sizing: border-box;
			box-shadow: 0px 5px 10px 2px #dcdcdc;
			opacity: 0.99;

			.pho {
				display: inline-block;
				width: 80px;
				height: 80px;
				vertical-align: middle;
				margin-right: 30rpx;
				border-radius: 50%;
				overflow: hidden;

				image {
					width: 100%;
					height: 100%;
					border-radius: 50%;
				}
			}

			.adoptedland {
				display: inline-block;
				margin: 10px 0;
				vertical-align: middle;
				text-align-last: left;
				.topland {
					width: 380rpx;
					font-size: 22px;
					color: black;
					margin: -5px 0 10px;
					text-align-last: left;
				}

				.topland:active {
					color: #ccc;
				}

				.bottomland {
					width: 380rpx;
					color: #9d9d9d;
					text-align-last: left;
				}

			}
		}
	}

	.orderContent-box {
		display: grid;
		width: 100vw;
		margin-top: 60px;
		grid-template-rows: repeat(5, 120rpx);
		justify-items: center;

		.orderContent-item {
			display: grid;
			width: 100vw;
			grid-template-columns: 130rpx 190rpx auto 150rpx;
			line-height: 150rpx;
			justify-items: center;
			align-items: center;
			font-size: 19px;

			image {
				width: 50rpx;
				height: 50rpx;
			}
		}
	}

	.banner_bg {

		position: absolute;
		/* 一定要用绝对定位 */
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		filter: blur(10px) brightness(90%);
		/* 模糊半径 */
		z-index: -1;
		margin: 0;

		image {
			width: 100%;
			height: 100%;
		}
	}
</style>
